<template>
  <el-row>
    <el-col :span="24">
      <RemarkForm v-model="newRemark" />
    </el-col>
    <el-col :span="24">
      <div class="footer">
        <el-button type="default"
                   @click="handleCancel">取消</el-button>
        <el-button type="primary"
                   @click="handleSubmit"
                   :disabled="disabled">确定</el-button>
      </div>
    </el-col>
  </el-row>
</template>

<script>
import axios from 'axios'
export default {
  name: "OrderRemark",
  props: {
    orderId: Number,
    sign: String
  },
  data () {
    return {
      newRemark: null,
      disabled: false,
    }
  },
  created () {
    this.newRemark = this.sign?.remarks
  },
  methods: {
    async handleSubmit () {
      if (!this.newRemark) {
        this.$message({ type: 'error', message: '请输入备注' })
        return
      }
      const url = "/order/remark";
      const remark = {
        orderId: this.orderId,
        remarks: this.newRemark,
      }
      const { code, message } = await axios.put(url, remark);
      if (0 !== code) {
        this.$message({ type: "error", message });
        return
      }
      this.$message({ type: "success", message });
      this.$emit("confirm", remark);
    },
    handleCancel () {
      this.$emit("cancel");
    }
  }
}
</script>